<template>
  <section id="car_friend_item" class="main">
      <mu-row gutter v-tap="{methods: checkDetail, meetId: value.id}">
          <mu-col width="35" class="img">
            <img :src="value.head ? addPath(value.head) : defaultImg" height="100%">
          </mu-col>
          <mu-col width="65" class="content">
            <div>
              <h4>{{value.name}}</h4>
            </div>
            <div>
              <p>简介：{{value.remark}}</p>
            </div>
            <div v-if="value.fleetType === '0'">
              <span>会员数：{{value.memberCount}}</span>
            </div>
            <div v-if="value.fleetType === '1'">
              <span>车辆数：{{value.carCount}}</span>
            </div>
          </mu-col>
        </mu-row>
        <mu-raised-button v-if="value.type==1" @click="sign(value.id)" :id="'fleetId_'+value.id" :label="(value.signState==1)?'已签到':'签到'" :disabled="(value.signState==1)?true:false"></mu-raised-button>
  </section>
</template>
<script>
import defaultImg from "assets/default_user_icon.png";
import SignService from "services/carFriend/Sign";
export default {
  name:'car_friend_item',
  data () {
      return {
          defaultImg
      }
  },
  props:{
      value:Object,
  },
  methods: {
      // 查看车友会详情
    checkDetail(params) {
      this.$router.push({
        name: "car_friend_detail",
        params: {
          meetId: params.meetId
        }
      });
    },
     sign(id) {
      this.$.mark().then(res => {
        this.memberPosition = JSON.parse(res);
        this.signState(id);
      });
    },
    signState(id) {
      (this.id = id),
        SignService.bind(this)(
          {
            searchValue: "",
            fleetId: id,
            memberPosition: this.memberPosition.address,
            pageable: {
              pageNumber: 1,
              pageSize: 100
            }
          },
          resp => {
            console.log(document.getElementById("fleetId_" + this.id));
            document.getElementById(
              "fleetId_" + this.id
            ).children[0].innerText =
              "已签到";
            this.hasSign = true;
            console.log("签到成功");
            this.refList();
          }
        );
    },
  }
}
</script>
<style scoped>
 .main {
  background-color: #fff;
  margin-bottom: 10px;
  padding: 7px 10px;
  padding-right: 5px;
  position: relative;
}
 .main button {
  position: absolute;
  top: 67%;
  right: 5%;
  border: solid 1px #abaaa8;
  width: 55px;
  height: 30px;
  background-color: #fff;
}
 .main button {
  position: absolute;
  top: 67%;
  right: 5%;
  border: solid 1px #abaaa8;
}
 .main .content div {
  padding-top: 10px;
}
 .main .content div span {
  margin-right: 15px;
}
.img {
  overflow: hidden;
  display: inline-block;
  width: 100px;
  height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>


